<%@ page import="com.csc.models.User" %>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<link rel="stylesheet" href="resources/css/bootstrap.css">
<link rel="stylesheet" href="resources/css/bootstrap-theme.css">
<link rel="stylesheet" href="resources/css/myStyle.css">

<script type="text/javascript" src="resources/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="resources/js/bootstrap.js"></script>

<title>User profile</title>
</head>
<body>
	<div class="container">
	<div class="row">
		<div class="col-md-12 col-md-offset-8">
			<p class="col-md-2" id="welcomename">Welcome <%= ((User)session.getAttribute("user")).getUserName() %></p>
			<a class="col-md-4" action="Logout" method="GET" href="">Logout</a>
		</div>
	</div>
		<div class="row">
			<div class="col-md-4">
				<div class="row panel panel-primary">
					<div class="panel-heading">Common infomation</div>
					<div class="panel-body">
						
					</div>
				</div>
				
				<div class="row panel panel-primary">
					<div class="panel-heading">User profiles</div>
					<div class="panel-body">
						<div id="nameProfile"><%= ((User)request.getAttribute("user")).getFirstName() + " " +
					 ((User)request.getAttribute("user")).getLastName() %></div>
						<div id="phoneProfile"><%= ((User)request.getAttribute("user")).getPhone() %></div>
						<div id="emailProfile"><%= ((User)request.getAttribute("user")).getEmail() %></div>
						<a class="col-md-12 col-md-offset-9">edit profiles</a>
					</div>
				</div>
			</div>
			<div class="col-md-8 panel panel-primary">
				<div class="panel-heading">User profiles editer</div>
				<div class="panel-body">
					<form id="frmUpdate" class="registerFrom form-horizontal" action="UpdateProfile" onsubmit="return checkMyRegister();" role="form">
						<div class="form-group">
							<label class="control-label col-sm-4" for="firstName">First name:</label>
							<div class="col-sm-8">
								<input type="text" id="firstName" name="firstName" class="form-control" placeholder="First Name">
							</div>
						</div>
						
						<div class="form-group">
							<label class="control-label col-sm-4" for="lastName">Last name:</label>
							<div class="col-sm-8">
								<input type="text" id="lastName" name="lastName" class="form-control" placeholder="Last Name">
							</div>
						</div>
						
						<div class="form-group">
							<label class="control-label col-sm-4" for="userName">User name:</label>
							<div class="col-sm-8">
								<input type="text" id="userName" name="userName" class="form-control" placeholder="UserName" disabled>
							</div>
						</div>
						
						<div class="form-group">
							<label class="control-label col-sm-4" for="email">Email:</label>
							<div class="col-sm-8">
								<input type="email" id="email" name="email" class="form-control" placeholder="Email address">
							</div>
						</div>
						
						<div class="form-group">
							<label class="control-label col-sm-4" for="password">Password:</label>
							<div class="col-sm-8">
								<input type="password" id="password" name="password" class="form-control" placeholder="Password">
							</div>
						</div>
						
						<div class="form-group">
							<label class="control-label col-sm-4" for="newpassword">New Password:</label>
							<div class="col-sm-8">
								<input type="password" id="newpassword" name="newpassword" class="form-control" placeholder="New Password"> 
							</div>
						</div>
						
						<div class="form-group">
							<label class="control-label col-sm-4" for="confirmpassword">Confirm Password:</label>
							<div class="col-sm-8">
								<input type="password" id="confirmpassword" name="confirmpassword" class="form-control" placeholder="Confirm Password">
							</div>
						</div>
						
						<div class="form-group">
							<label class="control-label col-sm-4" for="cellPhone">Cellphone:</label>
							<div class="col-sm-8">
								<input type="text" id=""cellPhone"" name=""cellPhone"" class="form-control" placeholder="CellPhone">
							</div>
						</div>
						<div class="row">
							<div class="col-md-6">
							<button class="btn btn-lg btn-primary btn-block" type="submit">Change</button>
							</div>
							<div class="col-md-6">
								<button class="btn btn-lg btn-primary btn-block" type="button" action="Controler" method="GET">Cancel</button>
							</div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
</body>
</html>